﻿/*
Copyright (c) Microsoft Corporation

All rights reserved.

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.  You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0   

THIS CODE IS PROVIDED *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT.  

See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. 
*/

//-------------------------------------------------- //
/*
scaling.js - 
Applies scaling to the canvas to dynamically adjust to screen resolutions.
*/
//---------------------------------------------------//

//cacheing setting globals for use ingame
var GLOBAL_SCALE = 1;
var GLOBAL_HDASSETS = false;
var GLOBAL_HDSCALE = 1;
var GLOBAL_APPWIDTH = 1;
var GLOBAL_APPHEIGHT = 1;

function HD_test() {
    //called before game load to test if game should load hi-res assets
    var appWidth = document.getElementsByTagName('body')[0].clientWidth;
    var appHeight = document.getElementsByTagName('body')[0].clientHeight;

    if ((appHeight >= 1920 && appWidth >= 1080) ||
            (appHeight > 1080 && appWidth > 1920)) {
        GLOBAL_HDASSETS = true;
    }
    else {
        GLOBAL_HDASSETS = false;
    }
}

function resize(eventArgs) {
    'use strict';
    var base = { width: 768, height: 1366 }; //base resolution scales
    var baseHD = { width: 1440, height: 2560 };

    var appWidth = document.getElementsByTagName('body')[0].clientWidth;
    GLOBAL_APPWIDTH = appWidth;
    var appHeight = document.getElementsByTagName('body')[0].clientHeight;
    GLOBAL_APPHEIGHT = appHeight;
    var newHeight = appHeight;
    var newWidth = appWidth;
    var scale = 1;

    var canvas = document.getElementById("game_canvas");

    if(!canvas){
        return false;
    };

    if ((appHeight / appWidth) < 0.55) { //check aspect ratio and use the largest aspect possible to still fit
        //set the style width and height to take advantage of css hardware scaling
        canvas.style.setAttribute('width', appWidth + "px");
        scale = appWidth / base.width;
        newHeight = base.height * scale;
        canvas.style.setAttribute('height', newHeight + "px");

        var container = document.getElementById("container");
        container.style.setAttribute('height', newHeight + "px");
        container.style.setAttribute('width', newWidth + "px");

        container.style.posLeft = 0;//posLeft for metro/IE
        container.style.left = 0; //left for non-metro
        container.style.posTop = (appHeight - newHeight) / 2; //posTop for metro/IE
        container.style.top = (appHeight - newHeight) / 2; //Top for non-metro

    }
    else {
        //set the style width and height to take advantage of css hardware scaling
        canvas.style.setAttribute('height', appHeight + "px");

        scale = appHeight / base.height;
        newWidth = base.width * scale;
        canvas.style.setAttribute('width', newWidth + "px");
        
        //resizes the container object to handle dom elements
        var container = document.getElementById("container");
        container.style.setAttribute('height', newHeight + "px");
        container.style.setAttribute('width', newWidth + "px");

        container.style.posLeft = (appWidth - newWidth) / 2;//posLeft for metro/IE
        container.style.left = (appWidth - newWidth) / 2; //left for non-metro
        container.style.posTop = 0; //posTop for metro/IE
        container.style.top = 0; //Top for non-metro*/
    }
    GLOBAL_SCALE = scale;
    if (GLOBAL_HDASSETS === true) {
        //if resolution is high switch to higher res scale
        GLOBAL_HDSCALE = 1366 / baseHD.height;
    }


}